<!-- Importamos los metodos js del abm de tickets -->
<script type="text/javascript" src="<?php echo base_url(); ?>js/tickets.js"></script>

<script type="text/javascript">
	//Esto se ejecuta cuando se termina de cargar la web
	$(document).ready(function(){
		//Le damos el foco al primer campo del formulario
		$("#sxc").focus();
	});
</script>

<!-- Identificador de seccion -->
<div>
	<hr>
	<ul class="breadcrumb">
		<li>
			<a href="<?php echo(site_url("inicio")); ?>">Home</a><span class="divider">/</span>
		</li>
		<li>
			<a href="<?php echo(site_url("ticket/consultar/".$idSxCSel)); ?>">Tickets</a><span class="divider">/</span>
		</li>
		<li>
			<a href="<?php echo(current_url()); ?>">Crear Ticket</a>
		</li>
	</ul>
	<hr>
</div>

<!-- Formulario y ayuda -->
<div class="row-fluid">
	<div class="box span8">
		<div class="box-header" data-original-title>
			<h2><i class="icon-edit"></i><span class="break"></span>Datos del Ticket</h2>
			<div class="box-icon">
				<a href="#" class="btn-minimize"><i class="icon-chevron-up"></i></a>				
			</div>
		</div>
		<div class="box-content">
			<form class="form-horizontal" action="<?php echo(site_url('ticket/crear')); ?>" id="formTicket" method="post" target="iframeUpload">
				<fieldset>
					<div id="campoSxC" class="control-group">				
						<label class="control-label" for="sxc">Servicio: (*)</label>
						<div class="controls">
							<select class="span9" id="sxc" name="sxc" required>
								<option value="0" selected="selected">Seleccionar</option>
								<?php
									//Recorremos todos los servicios de clientes que nos paso el controlador y generamos el selector
									foreach ($servicios->result() as $servicio){
										if($servicio->idSxC == $idSxCSel){
											echo ('<option selected="selected" value="'.$servicio->idSxC.'">'.$servicio->apellidoCliente.', '.$servicio->nombreCliente.' ('.$servicio->nombreServicio .')</option>');
										}else{
											echo ('<option value="'.$servicio->idSxC.'">'.$servicio->apellidoCliente.', '.$servicio->nombreCliente.' ('.$servicio->nombreServicio .')</option>');
										}
									}
								?>
							</select>
						</div>
					</div>				
					
					<div id="campoAsunto" class="control-group">
						<label class="control-label" for="asunto">Asunto: (*)</label>
						<div class="controls">
						  <input class="span9" id="asunto" name="asunto" type="text" value="" placeholder="Asunto" required>
						</div>
					</div>
					
					<div id="campoMensaje" class="control-group">
						<label class="control-label" for="mensaje">Mensaje: (*)</label>
						<div class="controls">
						  <textarea id="mensaje" name="mensaje" class="span9" rows="10" required></textarea>						 
						</div>
					</div>
					
					<div id="campoRespuesta" class="control-group">
						<label class="control-label" for="respuesta">Respuesta: (*)</label>
						<div class="controls">
						  <textarea id="respuesta" name="respuesta" class="span9" rows="10"></textarea>						 
						</div>
					</div>
					
					<div id="campoEstado" class="control-group">
						<label class="control-label" for="estado">Estado: (*)</label>
						<div class="controls">
							<select id="estado" name="estado" class="span9" required>
								<option value="0">Cerrado</option>
								<option value="1">Esperando Respuesta</option>
								<option value="2">Respondido</option>
							</select>
						</div>
					</div>
					
					<div class="form-actions">
						<button type="button" class="btn btn-primary" onclick="crearTicket()">Guardar Ticket</button>
					</div>
					
					<iframe id="respuesta" name="iframeUpload" style="display:none"></iframe>
				</fieldset>
			</form>
		</div>
	</div><!--/span-->
	<div class="box span4">
		<div class="box-header" data-original-title>
			<h2><i class="icon-edit"></i><span class="break"></span>Ayuda Rápida</h2>
			<div class="box-icon">
				<a href="#" class="btn-minimize"><i class="icon-chevron-up"></i></a>
			</div>
		</div>
		<div class="box-content">
			* Los campos marcados con (*) son obligatorios
		</div>
	</div><!--/span-->
</div><!--/row-->

<hr>